@charset "utf-8";

@import "reset";
@import "mixinCommon";

body{
    width: 100%;
    font-family: "microsoft yahei";
    .wrap{
        width:100%;
        min-width: 1025px;
        height: auto;
        margin: 0 auto;
        /** 页面头部 **/
        header{
           height:$h-120;
           line-height: $h-120;
           .h_logo{
              width: 82px;
              height: 77px;
              line-height: 77px;
              @include p_inlineb;
              vertical-align: middle;
              margin-left: 35px;
              img{
                  max-width: 100%;
                  vertical-align: middle;
              }
           }
           .h_bottom{
                float: right;
                margin-right: 3.4%;
                line-height: 100px;
                i{
                  cursor: pointer;
                  font-size: 23px;
                  color:#12b4a6;
                  &:hover{
                    color: $yellow; 
                  } 
                }
            }
           .h_bar{
               float: right;
               width: 45%;
               min-width: calc(391px + 5.5%);
               margin-top: 35px;
//             margin-right: 5.5%;
              div{
                  height: 52px;
                  float: left;
                  line-height:25px;
                  margin: 0px calc(100%/8 - 27px);
                  cursor:pointer;
                  &:first-of-type{
                      margin-left: 0;
                  }
                  &:last-of-type{
                      margin-right: 47px;
                  }
                  &::after{
                      @include pseudo;
                      transform:rotate(135deg) ;
                      border-left:1px solid $gray;
                      border-bottom:1px solid $gray;
                      width:0px;
                      margin-top:-8px;
                      margin-left:30px ;
                  }
                  &:hover::after{
                      transition:all .5s ease;
                      width: 100%;
                  }
                  span{
                      &:first-child{
                          display: block;
                          font-size: $font-20;
                          color: black;
                      }
                      &:last-child{
                          font-size: $font-17;
                          color: $gray;
                      }
                  }
              } 
            }// last of ul
        }
        /** 页面底部 **/
        footer{
            height: $h-80;
            background: $blue; 
            position: relative;
            margin-top: 105px;
            text-align: center;
            line-height: $h-80;
            .f_left{
                float: left;
                position: absolute;
                top:-84px;
            }
            .f_right{
                position: absolute;
                top:-51px;
                left:calc(100% - 237px);
            } 
            span{
                margin: 0 auto;
                font-size: $font-12;
                color: #fff;
            } 
        }//last of footer
    }
}


